import React from 'react'
import { useState } from 'react';
export default function Demo(){
    const [btnState, btnStateSet] = useBtnState({
        btn1:true,
        btn2:true,
        btn3:true
    });
    window.btnStateSet = btnStateSet
    window.btnState = btnState
	return (
		<div>
            <button disabled={btnState.btn1}>btn1</button>
            <button disabled={btnState.btn2}>btn2</button>
            <button disabled={btnState.btn3}>btn3</button>
		</div>
    )
}

// 自定义hook实现效果
// 当状态是对象时,可以像class组件的this.setState({btn1:false})一样，更改状态里的某个属性值
// btnStateSet({btn1:false})
function useBtnState(btnState={}) {
    const [state, setstate] = useState(btnState)
    const btnStateSet = (newState={}) => {
        setstate(Object.assign({},state,newState))
    }
    return [state,btnStateSet]
}


